
// 引入静态路由 动态路由
import { constantRoutes, asyncRoutes } from '@/router'

// Vuex的模块
// 不是所有的路由都能 被 访问
// 静态路由 是可以一直访问的
// 动态路由 得根据当前登录者身份进行筛选
const state = {
// 定义当前用户的路由权限
  routes: constantRoutes // 默认就有静态路由的权限
}

const mutations = {
  // 更新路由的数据
  setRoutes(state, newRoutes) {
    // 当前登录=> 获取新的路由(newRoutes) = > 合并
    // -----------------直接当前的静态路由---动态路由
    state.routes = [...constantRoutes, ...newRoutes]
  }
}

const actions = {
  // 筛选路由 menus= > 筛选出可以访问的动态路由表 进行返回 同时提交mutations
  filterRoutes({ commit }, menus) {
    const routes = []
    // 此时 menus 要和动态路由表匹配
    // asyncRoutes = >  [ {name:""}]
    // 因为以menus 为基准
    menus.forEach(key => {
      // key是一个标识
      // 从动态路由里面的的name找跟 menus的name名字一样 筛选出来
      routes.push(...asyncRoutes.filter(item => item.name === key))
      // 得到一个数组(匹配的数组)
    })
    // 给 mutation 更新数据 , 传值 routes
    commit('setRoutes', routes)
    // routes 就是筛选之后的路由
    // =>addroutes 添加到当前的路由表
    return routes // 返回一个数据
  }
}

export default {
  // 命名空间
  namespaced: true,
  state,
  mutations,
  actions
}
